/**
 * 路径移动demo案例
 */

import * as Cesium from "cesium";
import * as EasyCesium from "@xhymf1992/easy-cesium";

// 从路径动画集类派生自定义路径动画集类
class CustomPathAnimationCollection extends EasyCesium.PathAnimationCollection {
    //@ts-ignore
    constructor(options) {
        super(options);
    }

    /**
     * 每一帧对应的更新entity函数，可在派生类中自定义
     * @param index 待更新的entity的索引
     * @param entity 待更新的entity
     * @param t 当前帧距离播放经过的时间(s)
     */
    updateEntity(index: number, entity: EasyCesium.LabelEntity | EasyCesium.ModelEntity, t: number) {
        // model1在到达终点后回到起点重新移动
        if(entity.name == "model-entity1") {
            const duration = 15; // 假设model1从起点到终点的移动时长为10s
            t = t % duration;
        }

        // model2延迟2秒，并停止在终点
        if(entity.name == "model-entity2") {
            t = t - 2;
        }
        
        if(t < 0) t = 0;
         
        // 调用内部函数计算当前索引的entity以及经过t时间之后的位置和方向（也可自定义）
        let res = this.__getPositionAndDirectionOfEntityByTime(index, t);
        if(res) {
            // 更新实体的位置
            entity.position = res.position;
            
            // 更新实体的朝向：GltfModel可直接设置朝向
            if(entity instanceof EasyCesium.GltfModel) {
                entity.hpr = res.direction;
            }else {
                entity.heading = res.direction.heading;
                entity.pitch = res.direction.pitch;
                entity.roll = res.direction.roll;
            }
        }
    }
}

export async function startPathAnimations() {

    
    let position = Cesium.Cartesian3.fromDegrees(120, 30, 1000);
    // 构建gltf模型
    {
        let options1 = {
            id: "model-entity1", // entity对象id，具有唯一性，必填
            name: "model-entity1", // entity的名称，可选，默认为空
            show: true, // 是否显示，可选，默认显示
            position: position, // 模型坐标，必填
            url: "https://hz.gridworld.com.cn:50443/te3/di/get_file/Cesium_Man.glb/", // 模型链接，必选
            heading: 0, // 绕局部坐标系Z轴顺时针旋转角度(弧度制)，可选，默认为0
            pitch: 0, // 绕局部坐标系Y轴顺时针旋转角度(弧度制)，可选，默认为0，朝向正北
            roll: 0, // 绕局部坐标系X轴逆时针旋转角度(弧度制)，可选，默认为0
            scale: 5000, // 模型缩放大小，可选，默认为1
            minimumPixelSize: 0.0, // 模型最小像素大小，可选，默认为0
            clampAnimations: true, // 在没有关键帧的持续时间内是否保持最后一个动作，可选，默认为true
            heightReference: 1, // 高程类型：0-海拔；1-贴在地表或3dtiles；2-相对于地表或3dtiles；3-贴在地表；4-相对于地表；5-贴在3dtiles；6-相对于3dtiles，可选，默认为0
            distanceDisplayCondition: [0, 1e6], // 图元在该视角距离内可见，其他距离不可见：[near, far]
            color: "rgba(255,255,255,1.0)", // 模型颜色，该颜色将与模型自身的颜色进行混合，可选，默认为白色
            colorBlendMode: 0, // 混合模式：0-高亮（颜色相乘）；1-替换（覆盖原有颜色）；2-比例混合. 可选，默认为0
            colorBlendAmount: 0.5, // 混合模式为2时，该值表示输入颜色的占比(0.0-1.0)，当为1时为覆盖. 可选，默认为0.5
            silhouetteColor: "rgba(255,0,0,1)", // 轮廓的颜色，可选，默认为红色
            silhouetteSize: 0.0, // 轮廓大小，可选，默认为0 (不显示轮廓)
            animationIndex: 0, // 播放动画索引，可选，默认为undefined(不播放)
            animationLoop: true, // 动画是否循环播放，可选，默认为是
            animationMultiplier: 1, // 动画播放倍速，可选，默认为1。可用此参数调整走路动画的频率，保持与移动速度比一致，达到更好的显示效果
            viewer: window.viewer // cesium视图对象，必填
        };
    
        // @ts-ignore
        window.model1 = new EasyCesium.GltfModel(options1);
        //@ts-ignore
        await window.model1.init();

        // 显示gltf自带的动画名称列表
        //@ts-ignore
        console.log(window.model1.animationNameSet);

        // 播放第1个动画
        //@ts-ignore
        // window.model1.animationIndex = 0;

        // 停止播放动画
        //@ts-ignore
        // window.model1.animationIndex = undefined;

        // 调整名称标注的参数
        //@ts-ignore
        window.model1.labelEntity.textColor = "rgba(255,0,0,1)";

        //@ts-ignore
        window.model1.flyTo();
    }

    {
        let options2 = {
            id: "model-entity2", // entity对象id，具有唯一性，必填
            name: "model-entity2", // entity的名称，可选，默认为空
            show: true, // 是否显示，可选，默认显示
            position: position, // 模型坐标，必填
            url: "https://hz.gridworld.com.cn:50443/te3/di/get_file/Cesium_Man.glb/", // 模型链接，必选
            heading: 0, // 绕局部坐标系Z轴顺时针旋转角度(弧度制)，可选，默认为0
            pitch: 0, // 绕局部坐标系Y轴顺时针旋转角度(弧度制)，可选，默认为0，朝向正北
            roll: 0, // 绕局部坐标系X轴逆时针旋转角度(弧度制)，可选，默认为0
            scale: 5000, // 模型缩放大小，可选，默认为1
            minimumPixelSize: 0.0, // 模型最小像素大小，可选，默认为0
            clampAnimations: true, // 在没有关键帧的持续时间内是否保持最后一个动作，可选，默认为true
            heightReference: 1, // 高程类型：0-海拔；1-贴在地表或3dtiles；2-相对于地表或3dtiles；3-贴在地表；4-相对于地表；5-贴在3dtiles；6-相对于3dtiles，可选，默认为0
            distanceDisplayCondition: [0, 5e5], // 图元在该视角距离内可见，其他距离不可见：[near, far]
            color: "rgba(255,255,255,1.0)", // 模型颜色，该颜色将与模型自身的颜色进行混合，可选，默认为白色
            colorBlendMode: 0, // 混合模式：0-高亮（颜色相乘）；1-替换（覆盖原有颜色）；2-比例混合. 可选，默认为0
            colorBlendAmount: 0.5, // 混合模式为2时，该值表示输入颜色的占比(0.0-1.0)，当为1时为覆盖. 可选，默认为0.5
            silhouetteColor: "rgba(255,0,0,1)", // 轮廓的颜色，可选，默认为红色
            silhouetteSize: 1.0, // 轮廓大小，可选，默认为0 (不显示轮廓)
            animationIndex: 0, // 播放动画索引，可选，默认为undefined(不播放)
            animationLoop: true, // 动画是否循环播放，可选，默认为是
            animationMultiplier: 2, // 动画播放倍速，可选，默认为1。可用此参数调整走路动画的频率，保持与移动速度比一致，达到更好的显示效果
            viewer: window.viewer // cesium视图对象，必填
        };
    
        // @ts-ignore
        window.model2 = new EasyCesium.GltfModel(options2);
        //@ts-ignore
        await window.model2.init();

        //@ts-ignore
        // window.model2.flyTo();
    }
    

    // 设置路径动画参数
    let positionsCollection = [
        [
            Cesium.Cartesian3.fromDegrees(120, 30, 1000),
            Cesium.Cartesian3.fromDegrees(121, 30, 1000),
            Cesium.Cartesian3.fromDegrees(121, 31, 1000)
        ],[
            Cesium.Cartesian3.fromDegrees(120, 30, 1000),
            Cesium.Cartesian3.fromDegrees(120, 31, 1000),
            Cesium.Cartesian3.fromDegrees(121, 31, 1000)
        ]
    ]

    let speedCollection = [
        10000,
        20000
    ];

    let animationOptions = {
        positionsCollection, // 路径坐标点集，必填
        speedCollection, // 移动速度，单位m/s，可选，默认为1
        //@ts-ignore
        entityCollection: [
            //@ts-ignore
            window.model1,
            //@ts-ignore
            window.model2
        ], // 沿着路径移动的实体，必填
        playDuration: 20, // 总的播放时长(s)，可选，默认无穷大
        stopCallbackFunc: (animation: EasyCesium.PathAnimationCollection) => {
            console.log("stop", animation);

            // 以下设置可实现循环播放
            //@ts-ignore
            animation.playTime = 0;
            //@ts-ignore
            animation.__playStatus = 1;
        } // 动画播放时的回调函数，可选，默认为空。回调函数第一个参数为当前动画实例
    }

    // 构建路径动画实例
    //@ts-ignore
    window.animation = new CustomPathAnimationCollection(animationOptions);

    // 播放动画
    //@ts-ignore
    // window.animation.startAnimation();

    // 设置动画播放时刻
    //@ts-ignore
    // window.animation.playTime = 10;
    // window.animation.playTime = 0;

    // 暂停动画
    //@ts-ignore
    // window.animation.pauseAnimation();

    // 停止动画
    //@ts-ignore
    // window.animation.stopAnimation();
}